import { View, Button, Text, Image } from '@tarojs/components';
import Taro from '@tarojs/taro';
import React from 'react';
import { connect } from 'react-redux';
import * as T from '../../types';
import './index.less';
import actions from '../../actions';
import { store2Props } from '../../selectors';
import {IPLAND_OSS_HOST} from '../../../../constant';

const leftData = [
  {
    title: '绿绿泡泡 2023新款 怎么了',
    price: '109.99',
    img: `${IPLAND_OSS_HOST}shop/headPic.png`,
  },
  {
    title: '绿绿泡泡 2023新款 怎么了 就高冷 因为我是泡泡玛特啊',
    price: '109.99',
    img: `${IPLAND_OSS_HOST}shop/headPic.png`,
  },
  {
    title: '绿绿泡泡 2023新款 怎么了 就高冷 因为我是泡泡玛特啊',
    price: '109.99',
    img: `${IPLAND_OSS_HOST}shop/headPic.png`,
  },
  {
    title: '绿绿泡泡 2023新款 怎么了 就高冷 因为我是泡泡玛特啊绿绿泡泡 2023新款 怎么了 就高冷 因为我是泡泡玛特啊绿绿泡泡 2023新款 怎么了 就高冷 因为我是泡泡玛特啊绿绿泡泡 2023新款 怎么了 就高冷因为我是泡泡玛特啊',
    price: '109.99',
    img: `${IPLAND_OSS_HOST}shop/headPic.png`,
  },
  {
    title: '绿绿泡泡 2023新款 怎么了 就高冷 因为我是泡泡玛特啊',
    price: '109.99',
    img: `${IPLAND_OSS_HOST}shop/headPic.png`,
  },
];

const rightData = [
  {
    title: '绿绿泡泡 2023新款 怎么了 就高冷 因为我是泡泡玛特啊绿绿泡泡 2023新款 怎么了 就高冷  ',
    price: '109.99',
    img: `${IPLAND_OSS_HOST}shop/headPic.png`,
  },
  {
    title: '绿绿泡泡 2023新款 怎么了 就高冷 因为我是泡泡玛特啊',
    price: '109.99',
    img: `${IPLAND_OSS_HOST}shop/headPic.png`,
  },
  {
    title: '绿绿泡泡 2023新款 怎么了 就高冷 因为我是泡泡玛特啊',
    price: '109.99',
    img: `${IPLAND_OSS_HOST}shop/headPic.png`,
  },
  {
    title: '绿绿泡泡 2023新款 怎么了 就高冷 因为我是泡泡玛特啊绿绿泡泡 2023新款 怎么了 就高冷 因为我是泡泡玛特啊绿绿',
    price: '109.99',
    img: `${IPLAND_OSS_HOST}shop/headPic.png`,
  },
  {
    title: '绿绿泡泡 2023新款 怎么了 就高冷 因为我是泡泡玛特啊',
    price: '109.99',
    img: `${IPLAND_OSS_HOST}shop/headPic.png`,
  },
];

//@ts-ignore
actions().actions.loadReducer();
//@ts-ignore
@connect<Partial<T.IProps>, any>(store2Props, actions)
export default class List extends React.Component<Partial<T.IProps>, any> {
  constructor(props) {
    super(props);
    this.state = {};
  }

  render() {
    return (
      <View className="packageShop-list">
        <View className="list">
          <View className="listBox">
            {leftData.map((item, index) => {
              return <View className="listItem">
                <Image className="goodImg" src={item.img} mode="widthFix" />
                <View className="goodsInfo">
                  <Image className="limited" src={`${IPLAND_OSS_HOST}shop/icon1.png`} mode="widthFix" />
                  <Text className="goodsName">{item.title}</Text>
                </View>
                <View className="bot">
                  <View className="priceBox">
                    <Text className="priceSymbol">￥</Text>
                    <Text className="priceNum">109.99</Text>
                  </View>
                  <Image className="cart" src={`${IPLAND_OSS_HOST}shop/cart.png`} mode="widthFix" />
                </View>
              </View>
            })}
          </View>
          <View className="listBox">
            {rightData.map((item, index) => {
              return <View className="listItem">
                <Image className="goodImg" src={item.img} mode="widthFix" />
                <View className="goodsInfo">
                  <Image className="limited" src={`${IPLAND_OSS_HOST}shop/icon1.png`} mode="widthFix" />
                  <Text className="goodsName">{item.title}</Text>
                </View>

                <View className="priceBox">
                  <Text className="priceSymbol">￥</Text>
                  <Text className="priceNum">109.99</Text>
                </View>
              </View>
            })}
          </View>
        </View>
      </View>
    );
  }
}

//create by moon https://github.com/creasy2010/moon
